

@mixin ddpadding {
  padding: 0 20px;
}
@mixin center {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  @mixin top {
    display: flex;
    justify-content: center;
    align-items: flex-start;
  }
  
  @mixin bottom {
    display: flex;
    justify-content: center;
    align-items: flex-end;
  }
  
  @mixin leftBottom {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
  }
  
  
  @mixin left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  
  @mixin right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  
  @mixin rightBottom {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
  }
  
  @mixin columnCenter {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  @mixin columnTop {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
  }
  
  @mixin columnTopLeft {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
  
  @mixin columnLeft {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }
  
  @mixin absCenter {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  
  @mixin ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
  
  @mixin ellipsis2($line) {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $line;
    word-break: keep-all;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: break-word;
  }
  
@mixin bg-image($url) {    
  background-image: url($url + ".png");    
  @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3){        
        background-image: url($url + "@2x.png");    
        background-size: cover;
        background-repeat: no-repeat;
  }
}